<html>
<head>
    <meta charset="UTF-8">
    <title>Html和Java互调测试</title>
    <style type="text/css">
        h3,h4{
            text-align:center;
        }

        button {width: clientWidth; height: clientWidth; padding: 10px; font-size: 40px;}
        li {font-size: 40px;}
        <!--//width: clientWidth(包裹内容); 100%, 100px -->
    </style>
</head>


<body>
<ol>
    <li><button onclick="callJava_Test()">h5调用Java方法测试()</button></li>
    <li><button onclick="callJava_param_Test()">h5调用Java方法并传参(传入int, float, double, boolean, null, String')</button></li>
    <li><button onclick="callJava_param_Return_Test()">h5调用Java方法并传参(传入int, int'), 并有Java返回值</button></li>
    <li><button onclick="callJava_json_Return_Test()">h5调用Java方法并传json(传入json'), 然后Java返回json</button></li>
    <li><button onclick="callJava_Callback_Test()">h5调用Java方法, 等待Java有结果后才回调h5方法</button></li>
    <li><input type="file" name="选择文件" style="font-size: 40px;padding: 10px;" /></li>
</ol>
<!--<font color="#FF0000" size="16px">5.其它操作</font> <br />-->
<!--<font color="#FF0000" size="12px">还有一些其它操作没搞...</font>-->

<!--webView.loadUrl(↓)-->
<!--javascript:(function(b){console.log("YYNClient initialization begin");var a={queue:[],callback:function(){var d=Array.prototype.slice.call(arguments,0);var c=d.shift();var e=d.shift();this.queue[c].apply(this,d);if(!e){delete this.queue[c]}}};a.directGetUserInfo=a.externalLinkSingleLogin=a.faceonline=a.finish=a.geocoord=a.getLocationInfo=a.getUserId=a.getapntype=a.getsystem=a.getuserinfo=a.guide=a.login=a.openview=a.share=a.shareWX=a.upload=a.uploadVideoFile=function(){var f=Array.prototype.slice.call(arguments,0);if(f.length<1){throw"YYNClient call error, message:miss method name"}var e=[];for(var h=1;h<f.length;h++){var c=f[h];var j=typeof c;e[e.length]=j;if(j=="function"){var d=a.queue.length;a.queue[d]=c;f[h]=d}}var g=JSON.parse(prompt(JSON.stringify({method:f.shift(),types:e,args:f})));if(g.code!=200){throw"YYNClient call error, code:"+g.code+", message:"+g.result}return g.result};Object.getOwnPropertyNames(a).forEach(function(d){var c=a[d];if(typeof c==="function"&&d!=="callback"){a[d]=function(){return c.apply(a,[d].concat(Array.prototype.slice.call(arguments,0)))}}});b.YYNClient=a;console.log("YYNClient initialization end")})(window);-->

    <script type="text/javascript">

        <!-- android调js方法, 传入基础数据测试 -->
        function callH5Method_Basic_Test(aByte, aShort, anInt, aLong, aFloat, aDouble, aBoolean, aChar,
            aNull, string) {
            var json = JSON.stringify({'aByte':aByte,'aShort':aShort,'anInt':anInt,'aLong':aLong,
                                       'aFloat':aFloat, 'aDouble':aDouble, 'aBoolean':aBoolean,
                                       'aChar':aChar, 'aNull':aNull, 'string':string});
            console.log("json: " + json);
        }

        <!-- 传入数组对象 -->
        function callH5Method_Array_Object(array) {
            var json = JSON.stringify(array);
            console.log('json = ' + json + ', array[0] = ' + array[0]);
        }

        <!-- 传入List对象 -->
        function callH5Method_List_Object(list) {
            var json = JSON.stringify(list);
            console.log("json = " + json + ", list[0] = " + list[0]);
        }

        <!-- 传入Map对象 -->
        function callH5Method_Map_Object(map) {
            var json = JSON.stringify(map);
            console.log("json = " + json + ", map['key0'] = " + map['key0']);
        }

        <!-- 传入Object对象 -->
        function callH5Method_Object(bean) {
            var json = JSON.stringify(bean);
            console.log("json = " + json + ", bean.code = " + bean.code);
        }





        <!--android调js方法, 传入基础, 并有返回值测试 -->
        function callH5Method_Basic_Return_Test(aByte, aShort, anInt, aLong, aFloat, aDouble, aBoolean, aChar,
            aNull, string) {
            var json = JSON.stringify({'aByte':aByte,'aShort':aShort,'anInt':anInt,'aLong':aLong,
                                       'aFloat':aFloat, 'aDouble':aDouble, 'aBoolean':aBoolean,
                                       'aChar':aChar, 'aNull':aNull, 'string':string});
            return json;
        }
        <!-- 传入数组对象, 并有返回值 -->
        function callH5Method_Array_Object_Return(array) {
            var json = JSON.stringify(array);
            console.log('json = ' + json + ', array[0] = ' + array[0]);
            return array.length;
        }

        <!-- 传入List对象, 并有返回值 -->
        function callH5Method_List_Object_Return(list) {
            var json = JSON.stringify(list);
            console.log("json = " + json + ", list[0] = " + list[0]);
            return list.length;
        }

        <!-- 传入Map对象, 并有返回值 -->
        function callH5Method_Map_Object_Return(map) {
            var json = JSON.stringify(map);
            console.log("json = " + json + ", map['key0'] = " + map['key0']);
            return "key1 = " + map['key1'];
        }

        <!-- 传入Object对象, 并有返回值 -->
        function callH5Method_Object_Return(bean) {
            var json = JSON.stringify(bean);
            console.log("json = " + json + ", bean.code = " + bean.code);
            return bean.message;
        }





        <!-- h5调用Java方法测试 -->
        function callJava_Test() {
            //android123.calledByH5();  //不加上window也可以
            window.android123.calledByH5();
        }

        <!-- h5调用Java方法, 并传参测试 -->
        function callJava_param_Test() {
        <!-- aByte, aShort, anInt, aLong, aFloat, aDouble, aBoolean, aChar, aNull, string -->
            window.android123.calledByH5param(123, Math.PI, Math.E, true, null, "This is String!");
        }

        <!-- h5调用Java方法, 传参并有Java返回结果 -->
        function callJava_param_Return_Test() {
            var result = window.android123.calledByH5paramReturn(2, 3);
            alert('h5接收到Java计算结果:\n2 + 3 = ' + result);
        }

        <!-- h5调用Java方法, 传json并有Java返回结果 -->
        function callJava_json_Return_Test() {
        var json = JSON.stringify({'code':200, 'message':'请求成功!', 'data':null})
            var result = window.android123.calledByH5JsonReturn(json);
            alert('h5接收到Java返回Json:\n' + result);
        }

        <!-- h5调用Java方法, 等待Java有结果后才回调h5方法 -->
        function callJava_Callback_Test() {
            window.android123.calledByH5CallbackToH5UserInfo('onResult');
        }





        <!-- 回调的结果 -->
        function onResult(json) {
            var result = JSON.stringify(json);  //将json转换成String, 否则会打印[object Object]
            alert("Js收到Java回调消息：\n" + result);
        }





<!--        javascript:(function(b){-->
<!--            console.log("YYNClient initialization begin");-->
<!--            var a={queue:[],callback:function(){-->
<!--                var d=Array.prototype.slice.call(arguments,0);-->
<!--                var c=d.shift();-->
<!--                var e=d.shift();-->
<!--                this.queue[c].apply(this,d);-->
<!--                if(!e){-->
<!--                    delete this.queue[c]-->
<!--                    }-->
<!--                }-->
<!--            };-->
<!--            a.directGetUserInfo=a.externalLinkSingleLogin=a.faceonline=a.finish=a.geocoord=a.getLocationInfo=a.getUserId=a.getapntype=a.getsystem=a.getuserinfo=a.guide=a.login=a.openview=a.share=a.shareWX=a.upload=a.uploadVideoFile=function(){-->
<!--                var f=Array.prototype.slice.call(arguments,0);-->
<!--                if(f.length<1){-->
<!--                    throw"YYNClient call error, message:miss method name"-->
<!--                }-->
<!--                var e=[];-->
<!--                for(var h=1;h<f.length;h++){-->
<!--                    var c=f[h];-->
<!--                    var j=typeof c;-->
<!--                    e[e.length]=j;-->
<!--                    if(j=="function"){-->
<!--                        var d=a.queue.length;-->
<!--                        a.queue[d]=c;-->
<!--                        f[h]=d-->
<!--                    }-->
<!--                }-->
<!--                var g=JSON.parse(prompt(JSON.stringify({method:f.shift(),types:e,args:f})));-->
<!--                if(g.code!=200){-->
<!--                    throw"YYNClient call error, code:"+g.code+", message:"+g.result}-->
<!--                    return g.result-->
<!--                };-->
<!--                Object.getOwnPropertyNames(a).forEach(function(d){-->
<!--                    var c=a[d];-->
<!--                    if(typeof c==="function"&&d!=="callback"){-->
<!--                        a[d]=function(){-->
<!--                            return c.apply(a,[d].concat(Array.prototype.slice.call(arguments,0)))-->
<!--                        }-->
<!--                    }-->
<!--                });-->
<!--                b.YYNClient=a;-->
<!--                console.log("YYNClient initialization end")-->
<!--            })(window);-->
    </script>

</body>
</html>
